'use strict'
const webpack = require('webpack')
const path = require('path')
const TerserPlugin = require('terser-webpack-plugin')
const CompressionPlugin = require('compression-webpack-plugin')
const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')// webpack5中移除了nodejs核心模块的polyfill自动引入，所以需要手动引入

const productionGzipExtensions = ['js', 'css']

function resolve(dir) {
  return path.join(__dirname, dir)
}

module.exports = {
  publicPath: './',
  runtimeCompiler: true,
  devServer: {
    // // 设置主机地址
    // host: 'localhost',
    // // 设置默认端口
    // port: 998,
    headers: {
      'Access-Control-Allow-Origin': '*'
    },
    proxy: {
      '/services': {
        target: 'http://192.168.55.221/services',
        ws: false, // 如果要代理 websockets，配置这个参数
        secure: false, // 如果是https接口，需要配置这个参数
        changeOrigin: true, // 是否跨域
        pathRewrite: {
          '^/services': ''
        }
      },
      '/oen/node': {
        target: 'http://192.168.3.154:10012',
        ws: false, // 如果要代理 websockets，配置这个参数
        secure: false, // 如果是https接口，需要配置这个参数
        changeOrigin: true, // 是否跨域
        pathRewrite: {
          '^/oen': ''
        }
      }
    },
    client: {
      overlay: false
    }
  },
  // 解决边缘css告警
  css: {
    extract: process.env.NODE_ENV === 'production' ? {
      ignoreOrder: true
    } : false,
    loaderOptions: {
      postcss: {
        postcssOptions: {
          plugins: [
            require('postcss-pxtorem')({
            // 配置文档：https://www.npmjs.com/package/postcss-pxtorem
              rootValue: 80, // 根元素字体大小 16/1.25
              unitPrecision: 5, // 转换成rem后保留的小数点位数
              propList: ['font', 'font-size', 'height', 'line-height', 'top'], // 匹配CSS中的属性，* 代表启用所有属性
              exclude: /(node_module)/i, // 忽略一些文件，不进行转换，默认false，可以（reg）利用正则表达式排除某些文件夹的方法，例如/(node_module)/ 。如果想把前端UI框架内的px也转换成rem，请把此属性设为默认值
              selectorBlackList: ['.steps-index', '.el-pagination', '.flange-port', '.zoom-tools', '.tool-item', '.port-id', 'alarm-icon'], // 要忽略并保留为 px 的选择器
              mediaQuery: false, // （布尔值）允许在媒体查询中转换px
              minPixelValue: 10 // 设置要替换的最小像素值
            })
          ]
        }
      }
    }

  },
  configureWebpack: config => {
    const plugins = [
      new NodePolyfillPlugin()
    ]
    if (process.env.NODE_ENV === 'production') {
      const arr = [
        new webpack.ProvidePlugin({
          $: 'jquery',
          jQuery: 'jquery',
          'windows.jQuery': 'jquery'
        }),
        //   new webpack.optimize.ModuleConcatenationPlugin()
        // 配置compression-webpack-plugin压缩
        new CompressionPlugin({
          algorithm: 'gzip',
          test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
          threshold: 10240,
          minRatio: 0.8
        }),
        new TerserPlugin({
          terserOptions: {
            compress: {
              warnings: false,
              drop_console: true, // 传true就是干掉所有的console.*这些函数的调用.
              drop_debugger: true, // 干掉那些debugger;
              pure_funcs: ['console.log'] // 如果你要干掉特定的函数比如console.info ，又想删掉后保留其参数中的副作用，那用pure_funcs来处理
            }
          }
        }),
        new webpack.optimize.LimitChunkCountPlugin({ maxChunks: 5 }),
        new webpack.optimize.MinChunkSizePlugin({ minChunkSize: 10000 })
      ]
      plugins.push(...arr)
    }
    return {
      resolve: {
        alias: {
          '@': resolve('src')
        }
      },
      // 关闭 webpack 的性能提示
      performance: {
        hints: false
      },
      plugins: plugins
    }
  }
}
